<template>
    <div>
      <el-row>
        <el-col :span="12">
            <el-row class="basic-info name-info">
                待审核学者信息
                </el-row>
          <el-row class="scholar">
            
            <el-row class="basic-info">
                
                <img class="head-img" alr="" src="../../assets/images/avatar-grey-bg.jpg">
                <el-row class="name-info">
                {{author.name}}
                </el-row>
                <el-row class="affiliation-info">
                <i class="el-icon-office-building"></i>
                <span v-if="author.org && author.org !== 'null'"> - {{author.org}}</span>
                <span v-else> - 暂无机构信息</span>
                </el-row>
                <el-row class="position-info">
                <i class="el-icon-user"></i>
                <span v-if="author.position && author.position !== 'null'"> - {{author.position}}</span>
                <span v-else> - 暂无职位信息</span>
                </el-row>
                <el-row class="area-info" v-show="author.tags.length!==0">
                <i class="el-icon-map-location"></i>
                <span> - </span>
                <span class="area-name" v-for="(area, index) in author.tags" :key="index"  v-show="index<=5">
                    <span @click="searchKeyword(area.t)">{{area.t}}</span>
                    <span v-if="author.tags.length>index+1"> , </span>
                </span>
                </el-row>
            </el-row>
          </el-row>
        
        <!-- <el-row class="article-div">
          <el-row class="article-title">
            已发表文献
          </el-row>
          <hr>
          <el-table
              :data="papers.slice((currentPage-1)*pageSize,currentPage*pageSize)"
              height="600px"
              :cell-style = "{borderStyle:'none',padding:'2px 0'}"
              :default-sort = "{prop: 'year', order: 'descending'}"
          >
            <el-table-column
                label="文献"
                min-width="200"
            >
              <template slot-scope="scope">
                <el-row style="font-size: 16px;margin: 2px">
                  <span class="article-name" style="color: #217ad9; font-size: 16px;" @click="gotoArticle(scope.row.paper.paper_id)">{{scope.row.paper.title}}</span>
                </el-row>
                <el-row style="color: #999999;font-size: small;padding-left: 2px;margin: 0;border: none">
                      <span v-bind:key="i" v-for="(p,i) in scope.row.authors">
                        {{p}}<span v-if="i !== scope.row.authors.length-1">, </span>
                      </span>
                </el-row>
                <el-row style="color: #999999;font-size: small;padding-left: 2px;margin: 0;border: none">
                  <span>{{scope.row.paper.publisher}}</span>
                </el-row>
              </template>
            </el-table-column>
            <el-table-column
                label="被引用次数"
                min-width="50"
                align="center"
            >
              <template slot-scope="scope">
                <span v-if="scope.row.paper.n_citation">
                  {{scope.row.paper.n_citation}}
                </span>
                <span v-else>
                  0
                </span>
              </template>
            </el-table-column>
            <el-table-column
                prop="paper.lang"
                label="语言"
                min-width="100"
                align="center"
            >
  
            </el-table-column>
            <el-table-column
                prop="paper.year"
                label="时间"
                min-width="50"
            >
  
            </el-table-column>
          </el-table>
          <el-pagination align='center'
                         @size-change="handleSizeChange"
                         @current-change="handleCurrentChange"
                         :current-page="currentPage"
                         :page-sizes="[1,5,10,20]"
                         :page-size="pageSize"
                         layout="total, sizes, prev, pager, next, jumper"
                         :total="papers.length">
          </el-pagination>
        </el-row> -->
        </el-col>
    
            <el-row class="basic-info name-info">
                待审核用户信息
                <el-col :span="12" >
                    <!-- <el-row class="scholar">
                
                        <el-row class="basic-info">
                            真实姓名：{{uname}}
                            <br/>
                            所在机构：{{organization}}
                            <br/>
                            用户职位：{{uposition}}
                            <br/>
                            研究领域：{{uarea}}
                        </el-row>
                    
                    </el-row> -->
                    <el-row class="scholar">
            
            <el-row class="basic-info">
                
                <img class="head-img" alr="" src="../../assets/images/avatar-grey-bg.jpg">
                <el-row class="name-info">
                {{uname}}
                </el-row>
                <el-row class="affiliation-info">
                <i class="el-icon-office-building"></i>
                <span> - {{organization}}</span>
                
                </el-row>
                <el-row class="position-info">
                <i class="el-icon-user"></i>
                <span > - {{uposition}}</span>
                
                </el-row>
                <el-row class="area-info" v-show="author.tags.length!==0">
                <i class="el-icon-map-location"></i>
                <span> - </span>
                <span class="area-name" >
                    <span >{{uarea}}</span>
                </span>
                </el-row>
                <el-row class="area-info" v-show="author.tags.length!==0">
                <i class="el-icon-message"></i>
                <span> - </span>
                <span >
                    <span >{{email}}</span>
                </span>
                </el-row>
            </el-row>
          </el-row>
                </el-col>
            </el-row>
        <el-col :span="12" >
            
            
          <!-- <el-row class="connect-title">
            <span>相关作者</span>
            <hr>
          </el-row>
          <el-scrollbar class="connect-main">
            <el-row class="friends-item" v-for="(author, index) in relate_authors" :key="index">
              <el-col :span="4">
                <img alr="" v-if="relate_authors[index]" src="../../assets/images/avatar-grey-bg.jpg" style="height: 50px">
               <el-image v-if="relate_authors[index]" :src="author.image" ></el-image>
              </el-col>
              <el-col class="related-author" :span="17">
                <el-row class="related-author-name">
                  <el-col :span="20" style="padding-bottom: 1px"><span @click="gotoAuthor(author.id)">{{author.name}}</span></el-col>
                </el-row>
                <el-row class="related-author-affiliation">
                  <el-tooltip class="item" effect="light" :content="author.org" placement="bottom">
                    <span>{{author.org|ellipsis}}</span>
                  </el-tooltip>
                </el-row>
              </el-col>
            </el-row>
          </el-scrollbar> -->
        </el-col>
      </el-row>
      
        <el-col  class="article-div">
          <el-row class="article-title">
            待审核学者已发表文献
          </el-row>
          <hr>
          <el-table
              :data="papers.slice((currentPage-1)*pageSize,currentPage*pageSize)"
              height="600px"
              :cell-style = "{borderStyle:'none',padding:'2px 0'}"
              :default-sort = "{prop: 'year', order: 'descending'}"
          >
            <el-table-column
                label="文献"
                min-width="180"
            >
              <template slot-scope="scope">
                <el-row style="font-size: 16px;margin: 2px">
                  <span class="article-name" style="color: #217ad9; font-size: 16px;" @click="gotoArticle(scope.row.paper.paper_id)">{{scope.row.paper.title}}</span>
                </el-row>
                <el-row style="color: #999999;font-size: small;padding-left: 2px;margin: 0;border: none">
                      <span v-bind:key="i" v-for="(p,i) in scope.row.authors">
                        {{p}}<span v-if="i !== scope.row.authors.length-1">, </span>
                      </span>
                </el-row>
                <el-row style="color: #999999;font-size: small;padding-left: 2px;margin: 0;border: none">
                  <span>{{scope.row.paper.publisher}}</span>
                </el-row>
              </template>
            </el-table-column>
            <el-table-column
                label="被引用次数"
                min-width="40"
                align="center"
            >
              <template slot-scope="scope">
                <span v-if="scope.row.paper.n_citation">
                  {{scope.row.paper.n_citation}}
                </span>
                <span v-else>
                  0
                </span>
              </template>
            </el-table-column>
            <el-table-column
                prop="paper.lang"
                label="语言"
                min-width="40"
                align="center"
            >
  
            </el-table-column>
            <el-table-column
                prop="paper.year"
                label="时间"
                min-width="40"
            >
  
            </el-table-column>
          </el-table>
          <el-pagination align='center'
                         @size-change="handleSizeChange"
                         @current-change="handleCurrentChange"
                         :current-page="currentPage"
                         :page-sizes="[1,5,10,20]"
                         :page-size="pageSize"
                         layout="total, sizes, prev, pager, next, jumper"
                         :total="papers.length">
          </el-pagination>
  
        </el-col>
        <el-col>
            <div class="button">
              <el-button type="info" @click="handleRefuse()" class="button_li">拒绝</el-button>
              <el-button type="success" @click="handleAccept()" class="button_li">通过</el-button>
                </div>
            </el-col>
    </div>
</template>
  
  <script>
  export default {
    name: "ApplyDetail",
    data(){
      return{
        currentPage: 1, //当前页
        pageSize: 10, //每页行数
        total: 0, //列表总行数
        author_id: "",
        user_id: "",
        uname: "",
        uposition: "",
        uarea: "",
        organization: "",
        email: "",
        
        author:{
          id:"1",
          name:"Prof Melanie J Calvert",
          h_index:0,
          normalized_name:"author",
          orgs:[""],
          org:"University of Birmingham",
          position:"position",
          n_citation: 0,
          tags:[
            {
              t:"AI",
              w:0,
            },
            {
              t:"Deep Learning",
              w:0,
            },
          ],
          image:"",
        },
        // relate_authors:[
        //   {
        //     id:"1",
        //     name:"An-Wen Chan MD",
        //     h_index:0,
        //     normalized_name:"author1",
        //     orgs:[""],
        //     org:"University of Toronto",
        //     position:"1",
        //     pubs:[
        //       {
        //         i:"",
        //         r:0,
        //       }
        //     ],
        //     n_pubs:0,
        //     n_citation:0,
        //     tags:[
        //       {
        //         t:"",
        //         w:0,
        //       }
        //     ],
        //     image:"",
        //   },
        //   {
        //     id:"1",
        //     name:"Xiaoxuan Liu",
        //     h_index:0,
        //     normalized_name:"author1",
        //     orgs:[""],
        //     org:"University of Birmingham",
        //     position:"1",
        //     pubs:[
        //       {
        //         i:"",
        //         r:0,
        //       }
        //     ],
        //     n_pubs:0,
        //     n_citation:0,
        //     tags:[
        //       {
        //         t:"",
        //         w:0,
        //       }
        //     ],
        //     image:"",
        //   },
        //   {
        //     id:"1",
        //     name:"Samantha Cruz Rivera",
        //     h_index:0,
        //     normalized_name:"author1",
        //     orgs:[""],
        //     org:"University of Birmingham",
        //     position:"1",
        //     pubs:[
        //       {
        //         i:"",
        //         r:0,
        //       }
        //     ],
        //     n_pubs:0,
        //     n_citation:0,
        //     tags:[
        //       {
        //         t:"",
        //         w:0,
        //       }
        //     ],
        //     image:"",
        //   },
        //   {
        //     id:"1",
        //     name:"Prof Alastair K Denniston",
        //     h_index:0,
        //     normalized_name:"author1",
        //     orgs:[""],
        //     org:"University of Birmingham",
        //     position:"1",
        //     pubs:[
        //       {
        //         i:"",
        //         r:0,
        //       }
        //     ],
        //     n_pubs:0,
        //     n_citation:0,
        //     tags:[
        //       {
        //         t:"",
        //         w:0,
        //       }
        //     ],
        //     image:"",
        //   },
        // ],
        papers:[
          {
            paper: {
              paper_id: "1",
              title: "Deep learning for rare disease: A scoping review",
              author_id: ["1"],
              venue_id: "1",
              keywords: [""],
              year: 2022,
              n_citation: 3421,
              url: [""],
              lang: "English",
              page_start: 0,
              page_end: 0,
              doc_type: "",
              publisher: "Journal of Biomedical Informatics",
              volume: "",
              issue: "",
              issn: "",
              isbn: "",
              doi: "",
              abstract: ""
            },
            authors:["Junghwan Lee","Cong Liu","Chunhua Weng"],
          },
          {
            paper: {
              paper_id: "1",
              title: "AI-Based Clinical Decision Support System for Treatment of Chronic Lymphocytic Leukemia/Small Lymphocytic Lymphoma (CLL/SLL) and Prediction of Treatment Efficiency",
              author_id: ["1"],
              venue_id: "1",
              keywords: [""],
              year: 2022,
              n_citation: 956,
              url: [""],
              lang: "English",
              page_start: 0,
              page_end: 0,
              doc_type: "",
              publisher: "Serenus.AI",
              volume: "",
              issue: "",
              issn: "",
              isbn: "",
              doi: "",
              abstract: ""
            },
            authors:["Herishanu"],
          },
          {
            paper: {
              paper_id: "1",
              title: "Explainable digital forensics AI: Towards mitigating distrust in AI-based digital forensics analysis using interpretable models",
              author_id: ["1"],
              venue_id: "1",
              keywords: [""],
              year: 2022,
              n_citation: 173,
              url: [""],
              lang: "English",
              page_start: 0,
              page_end: 0,
              doc_type: "",
              publisher: "Forensic Science International: Digital Investigation",
              volume: "",
              issue: "",
              issn: "",
              isbn: "",
              doi: "",
              abstract: ""
            },
            authors:["Abiodun A.Solanke"],
          },
          {
            paper: {
              paper_id: "1",
              title: "Guidelines for clinical trial protocols for interventions involving artificial intelligence: the SPIRIT-AI extension",
              author_id: ["1"],
              venue_id: "1",
              keywords: [""],
              year: 2022,
              n_citation: 289,
              url: [""],
              lang: "English",
              page_start: 0,
              page_end: 0,
              doc_type: "",
              publisher: "The Lancet Digital Health",
              volume: "",
              issue: "",
              issn: "",
              isbn: "",
              doi: "",
              abstract: ""
            },
            authors:["SamanthaCruz Rivera","XiaoxuanLiu","An-WenChan","ProfAlastair KDenniston","ProfMelanie JCalvert"],
          },
          {
            paper: {
              paper_id: "1",
              title: "Explainable digital forensics AI: Towards mitigating distrust in AI-based digital forensics analysis using interpretable models",
              author_id: ["1"],
              venue_id: "1",
              keywords: [""],
              year: 2022,
              n_citation: 561,
              url: [""],
              lang: "English",
              page_start: 0,
              page_end: 0,
              doc_type: "",
              publisher: "Forensic Science International: Digital Investigation",
              volume: "",
              issue: "",
              issn: "",
              isbn: "",
              doi: "",
              abstract: ""
            },
            authors:["Abiodun A.Solanke"],
          }
        ],
      }
    },
    filters: {
      ellipsis: function(value) {
        if (!value) return "";
        if (value.length > 20) {
          return value.slice(0,20) + "...";
        }
        return value;
      },
    },
    methods:{
      //每页条数改变时触发 选择一页显示多少行
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
        this.currentPage = 1;
        this.pageSize = val;
      },
      //当前页改变时触发 跳转其他页
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
        this.currentPage = val;
      },
  
      searchKeyword(keyword){
        let routeUrl = this.$router.resolve({
          path: '/searchRes',
          query: { main: keyword }
        });
        window.open(routeUrl .href, "_self");
      },
      gotoAuthor(author_id){
        // const that = this
        // alert(author_id)
        const formData ={
          author_id: author_id
        }
        this.$axios({
          method: 'post',
          url:'/paper/judgeAuthorExist/',
          data: JSON.stringify(formData)
        }).then(res =>{
          if(res.data.is_exist){
            let routeUrl = this.$router.resolve({
              path: '/scholar',
              query: { v: author_id }
            });
            window.open(routeUrl .href, "_self");
            this.author_id = this.$route.query.v
            // alert(this.author_id)
            this.getScholarInfo()
            this.getAuthorArticle()
            document.documentElement.scrollTop = 0;
          }
          else{
            this.$message.error("暂无该作者信息！")
          }
        })
      },
      gotoArticle(article_id){
        let routeUrl = this.$router.resolve({
          path: '/article',
          query: { v: article_id }
        });
        window.open(routeUrl .href, "_self");
      },
      getScholarInfo(){
        const that = this
        const formData = {
          author_id: this.author_id
        }
        this.$axios({
          method: 'POST',
          url: '/paper/getScholarInfo/',
          data: JSON.stringify(formData)
        }).then(res=>{
          console.log(res.data.author)
          this.author = res.data.author
          that.getRelatedAuthors()
        })
      },
      getRelatedAuthors(){
        const that = this
        const formData = {
          author_id: this.author_id,
          tags: this.author.tags
        }
        this.$axios({
          method: 'POST',
          url: '/paper/getRelatedAuthors/',
          data: JSON.stringify(formData)
        }).then(res=>{
          that.relate_authors = res.data.authors
        })
      },
      getAuthorArticle(){
        // const that = this
        const formData ={
          author_id: this.author_id
        }
        this.$axios({
          method: 'POST',
          url: '/paper/getAuthorArticle/',
          data: JSON.stringify(formData)
        }).then(res=>{
          console.log(res)
          this.papers = res.data.papers
        })
      },
      getUserInfo(){
        // const that = this
        const formData = new FormData;
        formData.append("uid",this.user_id)
        this.$axios({
          method: 'POST',
          url: '/user/getCertificationDetails/',
          data: formData
        }).then(res=>{
          console.log(res)
          this.uname = res.data.certification.uname,
          this.uposition = res.data.certification.uposition,
          this.organization = res.data.certification.organization,
          this.uarea = res.data.certification.uarea
          this.email = res.data.certification.email
        })
      },
      handleRefuse() {
        const formData = new FormData;
        formData.append("uid", this.user_id)
        formData.append("flag",0)
        this.$axios({
          method: 'POST',
          url: '/user/checkCertification/',
          data: formData
        }).then(res=>{
          console.log(res)
          if(res.data.code == 200){
            this.$message.success("已拒绝该用户认证")
            this.$router.back();
          }
          else{
            this.$message.error("数据出错")
          }
        })
      },
      handleAccept() {
        const formData = new FormData;
        formData.append("uid", this.user_id)
        formData.append("flag",1)
        this.$axios({
          method: 'POST',
          url: '/user/checkCertification/',
          data: formData
        }).then(res=>{
          console.log(res)
          if(res.data.code == 200){
            this.$message.success("已通过该用户认证")
            this.$router.push("/admin2");
          }
          else{
            this.$message.error("数据出错")
          }
        })
      }
    },
  
    created() {
      document.documentElement.scrollTop = 0;
      // this.author_id = "54491887dabfae1e04144619"
      // this.user_id = 2
      this.author_id = this.$route.query.v
      this.user_id = this.$route.query.u
      // alert(this.author_id)
      this.getScholarInfo()
      this.getAuthorArticle()
      this.getUserInfo()
    }
  }
  </script>
  
  <style scoped>

.button{
    position: relative;
    padding: 5px;
    display: flex;
    justify-content: center;
  }
  .button_li{
    display: flex;
    justify-content: center;
  }
  .scholar{
    background-color: white;
    margin-left: 60px;
    margin-right: 60px;
    padding: 20px;
    height: 330px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .08), 0 0 6px rgba(0, 0, 0, .04);
  }
  .scholar2{
    background-color: white;
    margin-right: 20px;
    padding: 20px;
    height: 600px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .08), 0 0 6px rgba(0, 0, 0, .04);
  }
  .connect-info{
    background-color: white;
    margin-right: 0px;
    height: 500px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .08), 0 0 6px rgba(0, 0, 0, .04);
  }
  .connect-title{
    font-weight: bold;
    font-size: 20px;
    text-align: center;
    padding-top: 20px;
  }
  .connect-main{
    height: 200px;
  }
  
  .basic-info{
    text-align: center;
    font-size: 15px;
    font-weight: bold;
  }
  .name-info{
    font-size: 28px;
  }
  .head-img{
    border-radius: 50%;
    width: 150px;
    height: 150px;
  }
  .affiliation-info{
    font-size: 15px;
    font-weight: normal;
    padding-top: 5px;
  }
  .area-info{
    font-size: 15px;
    font-weight: normal;
    padding-top: 5px;
  }
  .area-name{
    font-size: 15px;
    color: #00b1fd;
    cursor: pointer;
  }
  .main-div{
    margin-top: 22px;
    min-height: 620px;
  }
  .article-div{
    /*text-align: center;*/
    background-color: white;
    margin-left: 60px;
    margin-right: 60px;
    padding: 20px;
    margin-bottom: 10px;
    min-height: 600px;
    width: 1305px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .08), 0 0 6px rgba(0, 0, 0, .04)
  }
  .friends-item{
    padding-bottom: 13px;
    margin-top: 18px;
    border-bottom: #e2e2e2 solid 1px;
    margin-left: 10px;
    margin-right: 10px;
  }
  .friends-item >>> .el-image{
    height: 45px;
    width: 45px;
    border-radius: 50%;
  }
  .related-author{
    padding-left: 10px;
  }
  .related-author-name{
    font-weight: bold;
  }
  .related-author-name:hover{
    color: #00b1fd;
    cursor: pointer;
  }
  .connect-main >>> .el-scrollbar__wrap {
    overflow-x: hidden;
  }
  .article-title{
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    margin-top: 20px;
  }
  .el-table--border::after, .el-table--group::after, .el-table::before{
    background-color: rgba(41, 56, 69, 0);
  }
  
   .el-table__body-wrapper::-webkit-scrollbar {
    width: 7px;
  }
   .el-table__body-wrapper::-webkit-scrollbar-thumb  {
    background-color: rgba(203, 202, 202, 0.66);
    border-radius: 8px;
  }
  .article-name:hover{
    cursor: pointer;
    text-decoration: underline #217ad9;
  }
  
  </style>